<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
function utf8decode(string) {
	var utftext=unescape(string);
	var string = "";
	var i = 0;
	var c = c1 = c2 = 0;

	while (i < utftext.length) {

		c = utftext.charCodeAt(i);

		if (c < 128) {
			string += String.fromCharCode(c);
			i++;
		} else if ((c > 191) && (c < 224)) {
			c2 = utftext.charCodeAt(i + 1);
			string += String.fromCharCode(((c & 31) << 6) | (c2 & 63));
			i += 2;
		} else {
			c2 = utftext.charCodeAt(i + 1);
			c3 = utftext.charCodeAt(i + 2);
			string += String.fromCharCode(((c & 15) << 12)
					| ((c2 & 63) << 6) | (c3 & 63));
			i += 3;
		}

	}
	return string;
}
</script>

<script type="text/javascript">


function push(event) {
	document.getElementById('excuse').innerHTML = utf8decode(event);
}
function disconnected() {
	document.getElementById('excuse').innerHTML = 'Click to see MORE reasons why this souldn\'t work!';
	document.getElementById('control').value = 'start';
}

var comet = {
		technique: /(Firefox|Safari)/i.test(navigator.userAgent) ? 1 : /MSIE/i.test(navigator.userAgent) ? 2 : 3,
		open: function(URL, push, disconnected) {
			this.push = push || new Function; this.disconnected = disconnected || new Function;
			this.URL = URL; this.active = true;
			switch (this.technique) {
				case 1: // We're doing XHR streaming!
					if (!this.transport) { this.transport = new XMLHttpRequest(); }
					this.eventID = 0;
					this.transport.open('GET', this.URL, true);
					this.transport.onreadystatechange = this.scope(this.XHRcallback, this);
					this.transport.send(null);
					break;
				case 2: // We're using a forever frame with that fancy IE hack.
					if (!this.transport) { this.transport = new ActiveXObject('htmlfile'); }
					this.transport.open();
					this.transport.write('<html><body></body></html>');
					this.transport.close();
					this.transport.parentWindow.push = this.push;
					this.transport.body.innerHTML = '<iframe id="SimpleComet" src="'+this.URL+'"></iframe>';
					setTimeout(this.scope(this.checkFrame, this), 500);
					break;
				case 3: // Falling back on using a standard forever frame.
					if (!this.transport) { this.transport = document.createElement('iframe'); }
					this.transport.style.display = 'none';
					this.transport.src = this.URL;
					this.transport.onload = this.scope(this.close, this);
					document.body.appendChild(this.transport);
					break;
			}
		},

		close: function() {
			if (!this.active) { return; } else { this.active = false; }
			switch (this.technique) {
				case 1: if (this.transport.readyState != 4) { this.transport.abort(); } break;
				case 2: this.transport.body.removeChild(this.transport.getElementById('SimpleComet')); break;
				case 3: this.transport.src = 'about:blank'; document.body.removeChild(this.transport); break;
			}
			this.disconnected();
		},

		XHRcallback: function() {
			//alert(this.transport.readyState+":"+this.transport.getAllResponseHeaders()+":"+this.transport.responseText);
			if (this.transport.readyState == 4) { this.close(); return; }
			var events = this.transport.responseText.match(/<comet>(.+?)<\/comet>/g);
			while (events && events[this.eventID]) {
				this.push(events[this.eventID].substring(7, events[this.eventID].length-8));
				this.eventID++; 
			}
		},

		checkFrame: function() {
			if (!this.transport.getElementById('SimpleComet')) { return; }
			if (this.transport.getElementById('SimpleComet').readyState == 'complete') { this.close(); return; }
			setTimeout(this.scope(this.checkFrame, this), 500);
		},

		scope: function(f, scope) {
			return function() {
				return f.apply(scope); 
			} ;
		}

	};
 
function toggle() {
	if (!comet.active) {
		comet.open('http://localhost:8080/Hello.chat?opt=join', push, disconnected);
		document.getElementById('control').value = 'stop';
	} else {
		comet.close();
	}
}
</script>

<script type="text/javascript">
var xhr=new XMLHttpRequest();
function send(nick,msg){
	xhr.open("get", "http://localhost:8080/Hello.chat?opt=send&nick="+nick+"&msg="+getmsg(), true);
	xhr.onreadystatechange=function(){
		//alert('readyState:'+xhr.readyState+":"+'responseText:'+xhr.responseText);
	};
	xhr.send(null);
}

function getmsg(){
	return document.getElementById('msg').value;
}
</script>
<title>Insert title here</title>
</head>
<body>
	<div id="content">
		<input id="control" type="submit" onclick="toggle();" value="start">
		<div id="excuse"><div style="clear: both;"></div></div>
	</div>
	<input type="text" id="msg">
	<input id="control" type="submit" onclick="send('guxuede');" value="发送">
</body>
</html>
